<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
//程序从上往下执行, 当遇到同步任务, 会直接在执行栈中执行, 当遇到异步任务会先放入到任务队列中等待执行, 执行栈的代码执行完毕后, 在事件循环机制下,每隔一个很短的时间去检查任务队列中是否还有未执行的异步任务, 如果有则取出最先放入任务队列一个异步任务放入执行栈开始执行. 在事件循环机制下, 每个放入任务队列中的任务都会被依次执行. 
console.log(1);

//对于定时器,从定时器被创建开始, 会等到定时时间到才会将异步任务放入任务队列, 这个定时器等待时间长, 所以会后放入任务队列
setTimeout(()=>{
    console.log(2);
},200)

//对于定时器,从定时器被创建开始, 会等到定时时间到才会将异步任务放入任务队列, 这个定时器等待时间短, 所以会先放入任务队列, 在事件循环机制下, 根据任务队列先进先出的特点, 也会优先取出执行.
setTimeout(()=>{
    console.log(4);
},100)

console.log(3);


//最终输出结果为: 1 3 4 2
</script>
</html>